<template>
  <view class="content">
    <custom-input
      v-model="inputStr"
      focusColor="#1f2329"
      showClear
      :round="25"
      placeholder="请输入"
      :maxlength="20"
      showCharNumber
    ></custom-input>

    <custom-textarea :height="200" showCharNumber :maxlength="20" showClear></custom-textarea>
    <markettips-view v-model="show"></markettips-view>

    <view class="button-view" style="display: flex; flex-wrap: wrap">
      <tm-button :margin="[10]" label="弹框" @click="showMarketClick"></tm-button>
      <tm-button :margin="[10]" label="按钮"></tm-button>
      <tm-button :margin="[10]" label="按钮"></tm-button>
      <tm-button :margin="[10]" label="按钮"></tm-button>
      <tm-button :margin="[10]" label="按钮"></tm-button>
    </view>

    <u-button text="跳转到分页的页面" @click="jumpClick"></u-button>
    <!-- <custom-copy text="我是将要复制的文字" /> -->
    <!-- <custom-empty /> -->
    <u-button text="文章列表" @click="artcalListClick"></u-button>
    <u-button text="注册按钮" @click="registeClick"></u-button>
    <u-button text="登录按钮" @click="loginClick"></u-button>
    <view style="display: flex; justify-content: center">
      <custom-tooltip text="扩展显示" :buttons="['扩展', '刷新']"></custom-tooltip>
    </view>
    <custom-input
      v-model="inputStr"
      focusColor="#1f2329"
      showClear
      :round="25"
      placeholder="请输入"
      isShowSearch
    ></custom-input>
    <!-- <u-image :src="imageUrl" width="80px" height="80px" shape="circle"></u-image> -->
    <view class="big-icon" style="display: flex; justify-content: center">
      <tm-icon :font-size="40" name="tmicon-playcircle-fill" @click="iconClick"></tm-icon>
    </view>

    <u-checkbox-group v-model="checkbox" placement="column">
      <u-checkbox
        size="24rpx"
        shape="circle"
        labelSize="30rpx"
        iconSize="28rpx"
        label="苹果"
        name="苹果"
      ></u-checkbox>
    </u-checkbox-group>
  </view>
</template>

<script setup lang="ts">
import { onReady } from "@dcloudio/uni-app";
import { registerUser, loginUser } from "@/api/login";
import { ref } from "vue";
const show = ref(false);
const imageUrl = ref("");
const inputStr = ref("");
const checkbox = ref();
function artcalListClick() {
  uni.navigateTo({
    url: "/page_sub/scroll-zpaging/scroll-zpaging"
  });
}
function showMarketClick() {
  show.value = true;
}

function jumpClick() {
  uni.navigateTo({
    url: "/page_sub/signature-board/signature-board"
  });
  // const parames = {
  //     name: '分页demo'
  // };
  // uni.navigateTo({
  //     url: `/page_sub/demo/demo?params=${encodeURIComponent(JSON.stringify(parames))}`
  // });
}
// function clearMethods() {
//   keyword.value = "";
// }

function iconClick() {
  console.log("点击了icon");
}
function registeClick() {
  registerUser({
    username: "张三丰111",
    password: "Wang123@"
  }).then((res) => {
    console.log(res);
  });
}

function loginClick() {
  loginUser({
    username: "张三丰111",
    password: "Wang123@"
  }).then((res) => {
    const url = res.data.data.user_pic;
    imageUrl.value = url;
    console.log(url);
  });
}
onReady(() => {
  // 签名板点击保存按钮的回调
  uni.$on("q-sign", (imagePath: string) => {
    console.log("imagePath-----", imagePath);
  });
});
</script>

<style lang="scss" scoped></style>
